<template>
  <page-wrap back hide-tab title="投递记录" stayStill class="page">
    <view class="record-list">
      <!-- <view
        v-for="(item, index) in recordList"
        :key="index"
        class="record-list-item"
        @click="handleDetail(item)"
      >
        <view class="record_title">{{ item.jtzw }}</view>
        <view class="record_cname">{{ item.cname }}</view>
        <view class="record_date">{{ item.sendtime }}</view>
        <view v-if="item.valid" class="record_flag"></view>
      </view> -->
      <JobItemR
        v-for="item in recordList"
        :key="item.id"
        :item="item"
        :props="props"
        @itemClick="handleItem"
      />
      <u-empty v-if="showEmpty" text="投递记录为空" mode="list"></u-empty>
      <u-loadmore
        v-else
        class="job-more"
        :status="status"
        :load-text="loadText"
      />
    </view>
  </page-wrap>
</template>

<script>
import { getMyCmailboxList } from "@/api/index";
import JobItemR from "@/components/JobItemR";
import ShareMixin from '@/mixins/share';

export default {
  mixins: [ShareMixin],
  components: {
    JobItemR,
  },
  data() {
    return {
      page: 0,
      size: 10,
      total: 0,
      personId: uni.getStorageSync("person-id").slice(2) || undefined,
      recordList: [],
      showEmpty: false,
      status: "loadmore",
      loadText: {
        loadmore: "加载更多",
        loading: "加载中",
        nomore: "没有更多了",
      },
      customStyle: {
        border: "none",
        backgroundColor: "#E9ECEF",
      },
      props: {
        title: "jtzw",
        salary: "salaryNew",
        cname: "cname",
        time: "time",
        region: "regionName",
        fldy: "fldy",
        gznum: "gznum",
        edus: "edus",
        jobtypes: "jobtypes",
        yuangong: "yuangong",
        logo: "logo",
        valid: 'valid'
      },
      sharePath: '/pagesSub/userCenter/deliveryRecord/index'
    };
  },
  mounted() {
    this.getList();
  },
  onReachBottom() {
    this.page = this.page + 1;
    this.getList();
  },
  // onShareAppMessage() {
  //   return {
  //     title: this.$selfName,
  //     path: "/pages/index/index",
  //   };
  // },
  // onShareTimeline() {
  //   return {
  //     title: this.$selfName,
  //     path: "/pages/index/index",
  //   };
  // },
  methods: {
    handleDetail(item) {
      uni.navigateTo({
        url: "/pagesSub/public/jobDetail/index?jobId=" + item.jobid,
      });
    },
    getList() {
      if (this.status === "loading") return;
      this.status = "loading";
      let params = {
        person_id: this.personId,
        search_arr: JSON.stringify({
          saler_info: "1",
        }),
        condition_arr: JSON.stringify({
          page_size: "" + this.size,
          page: "" + this.page,
        }),
      };
      getMyCmailboxList(params).then((res) => {
        this.status = "nomore";
        if (res.data.code == 2) {
          this.showEmpty = true;
        } else if (res.data && res.data.length) {
          this.total = res.pageparam.sums;
          if (this.recordList.length >= this.total) {
            return;
          }
          let data = res.data.map(item => {
            if(item.fldy) {
              item.fldy = item.fldy.slice(0, 3)
            }
            return item;
          })
          this.recordList.push(...data);
        }
      });
    },
    handleItem(item) {
      uni.navigateTo({
        url: "/pagesSub/public/jobDetail/index?jobId=" + item.jobid,
      });
    }
  },
};
</script>

<style lang="scss">
$img-base-record: $img-base + "deliveryRecord/";
@include img-base-self(".record_flag", "deliveryRecord/invalid.png");
.page {
  .record-list {
    margin: 32rpx 32rpx 24rpx;
    &-item {
      position: relative;
      margin-bottom: $uni-spacing-col-lg;
      padding: 32rpx;
      background-color: $uni-bg-color;
      border-radius: $uni-border-radius-big;
      .record_title {
        margin-bottom: $uni-spacing-col-lg;
        font-size: $uni-font-size-lg;
        font-weight: bold;
      }

      .record_cname {
        margin-bottom: $uni-spacing-col-lg;
        font-size: $uni-font-size-sm;
      }

      .record_date {
        font-size: $uni-font-size-sm;
        color: $uni-text-color-555;
      }

      .record_flag {
        position: absolute;
        width: 73rpx;
        height: 73rpx;
        right: 32rpx;
        top: 32rpx;
        background-repeat: no-repeat;
        background-position: center top;
        background-size: 100% auto;
      }
    }
  }
}
</style>
